{% extends "base.html" %}

{% block css %}
<link rel="stylesheet" type="text/css" href="/static/css/task.css" />
{% endblock %}

{% block javascript %}
<script type="text/javascript" src="/static/javascript/jquery-ui-personalized-1.5.js"></script>
<script type="text/javascript" src="/static/javascript/task.js"></script>
<script type="text/javascript">
    $(function(){
        taskPanel = new TaskPanel('#task_panel');
    
        $('#btn_add_task').click(function(e){
            //taskPanel.show();
            box = new Boxy(
                $('#task_panel'), {
                    title : '添加任务', 
                    x : e.clientX,
                    y : e.clientY                    
                });
            //box.show();
        });
        
        $('#btn_choose_group').click(function(){
            alert('btn_choose_group');
        });
        
        $('#add_task_cancel').click(function(){
            taskPanel.hide();
        });

        $('#add_task_ok').click(function(){
            taskPanel.addTask('#add_task_form');
        });
        
        
        
    });

</script>
{% endblock %}

{% block title %}任务{% endblock %}

{% block content %}
<p><a id="btn_add_task" href="#">添加任务</a></p>
<div id="task_panel" class="add-task-hide">
    <form id="add_task_form" class="boxy" action="." method="POST">
        <p>
            <label for="task_item">任务内容:</label>
            <input id="task_item" type="text" name="task" size="30"/>
        </p>
        <p>
            <label for="task_group">任务组:</label>
            <input id="task_item" type="text" name="group1" size="20"/>
            <select id="task_group" name="group2">
            <option value=""></option>
            {% if taskgroups %}
                {% for group in taskgroups %}
                    <option value="{{ group.key }}">{{ group.name }}</option>
                {% endfor %}
            {% endif %}
            </select>
            <a id="btn_choose_group" href="#">选择</a>
        </p>
        <p>
            <input id="add_task_ok" type="button" value="提交"/>
            <input id="add_task_cancel" type="button" value="取消"/>
        </p>
    </form>
</div>
<div id="task-list">
    <ul>
    {% for item in tasks %}
        <li>{% ifequal item.kind "Task" %} <input type="checkbox"/> {% endifequal %} {{ item.name }}</li>
        {% if item.tasks %}
            <ul>
            {% for task in item.tasks %}
                <li><input type="checkbox"/>{{ task.name }}</li>
            {% endfor %}
            </ul>
        {% endif %}
    {% endfor %}
    </ul>
</div>
{% endblock %}